

#wrapper {
	width: 725px;

	font: 800 1em arial;
	text-align: center;
	
	background: url(../images/bg.gif) repeat-y 50% 0;
	
	padding-left: 33px;
	margin: 0 auto;
	
	margin-top: 25px;
}

.controls {
	float: right;
	width: 160px;
	margin: 10px;
	text-align: left;
}

/*.controls img {	margin: 5px;	}*/


.double {
	width: 480;
	margin: 10px;
	float: left;
	background: url(../images/fcard.png) no-repeat;
}

.side {
	width: 240px; /*half of double*/
	height: 160px; 
	text-align: center;
	padding-top: 25px;
}

.side input, textarea, p {margin-top: 13px;}
.side p {padding: 5px;}
textarea {overflow: hidden; width: 200px;}
.front {float:left;}
.back {float: left;}
div.log {
	font-size: 0.9em;
	float: left;
	height: 50px;
	margin-left: 80px;
	width: 100%;
}
div.logged_in {
	font-size: 0.9em;
	float: left;
	height: 50px;
	margin-left: 8px;
	width: 100%;
}
.nav {
		float:left;
		display: inline;
		margin-top: 0px;
		margin-left: -55px;
}

.nav a {display: block; padding:2px; float: left; width: 80px; text-indent: 5px; text-align: left;background: url(../images/tape.png) no-repeat;}
a {color: #444; text-decoration: none;}
a:hover {color: #256;}
h5 {font-size: 12px;}

ul li {display: inline;}
ul {margin: 10px 0;}

a, input.update, input.create {
	width: 111px;
	height: 25px;
	display: block;
	float: left;
	overflow: hidden;
	margin: 5px;
	background: no-repeat;
}

a.submit {
	background: url(../images/submit.png);
}

a.show:link {
	background: url(../images/show.png);
}
a.show:visited {
	background: url(../images/show.png) 333px;
}
a.show:hover {
	background: url(../images/show.png) 222px;
}

a.edit {
	background: url(../images/edit.png);
}
a.edit:hover {
	background: url(../images/edit.png) 222px;
}


a.goback {
	background: url(../images/back.png);
}
a.goback:hover {
	background: url(../images/back.png) 222px;
}


a.delete {
	background: url(../images/delete.png);
}
a.delete:hover {
	background: url(../images/delete.png) 222px;
}

a.update {
	background: url(../images/update.png);
}
a.update:hover {
	background: url(../images/update.png) 222px;
}

a.create {
	background: url(../images/create.png);
}
a.create:hover {
	background: url(../images/create.png) 222px;
}

a.newset {
	background: url(../images/newset.png);
}
a.newset:hover {
	background: url(../images/newset.png) 222px;
}

a.newcard {
	background: url(../images/newcard.png);
}
a.newcard:hover {
	background: url(../images/newcard.png) 222px;
}

a.play {
	background: url(../images/play.png);
}
a.play:hover {
	background: url(../images/play.png) 222px;
}

a.play_wrong {
	background: url(../images/play_wrong.png);
}
a.play_wrong:hover {
	background: url(../images/play_wrong.png) 222px;
}

a.play_until {
	background: url(../images/play_until.png);
}
a.play_until:hover {
	background: url(../images/play_until.png) 222px;

}
a.stats {
	background: url(../images/stats.png);
}
a.stats:hover {
	background: url(../images/stats.png) 222px;
}

a.next {
	background: url(../images/next.png);
}
a.next:hover {
	background: url(../images/next.png) 222px;
}

#question {background: url(../images/question.png); width: 357px; height: 237px; float: left;}
#answer {background: url(../images/answer.png); width: 357px; height: 237px; float:left;}

#question p, #answer p {padding-top: 50px;}

.clear {clear: both;}

.lgout {float: right; background: url(../images/logout.png) no-repeat; width: 123px; height: 30px; padding-top: 2px;margin-right:15px;}
.lgin {background: url(../images/logout.png) no-repeat; width: 123px; height: 30px;padding-top:2px;}

#header {width: 550px; background: url(../images/fffit.png) no-repeat; height: 120px; padding-left: 150px;}

h4 {text-transform: uppercase;margin-left:6px;margin-top:14px;}
h4.sets, h4.sets_play {color: #444; font-weight: 800; text-align: left; width: 680px;
/*added 12 1*/
	position:relative;}

h4.sets span {text-transform: none; font-size: smaller; 
	/*
	float: right;
	margin-top: -17px; 
	margin-right: 17px;*/
	position: absolute;
	right: 30px;
	line-height:1.5em;
	}
/*h4.sets_play span {text-transform: none; font-size: smaller;
	float: right; margin-top: -17px; margin-right: 17px;
	position: absolute;
	line-height:1.6em;
	right: 30px;
	}*/
	
h4.sets_play span {	font-size:smaller;
	line-height:1.6em;
	position:absolute;
	right:38px;
	text-transform:none;}
h4.sets {background: url(../images/h4.png) no-repeat; width: 680px; height: 30px;padding: 4px 10px;padding-bottom:0;}
h4.sets_play {background: url(../images/h4bg.png) no-repeat; width: 680px; height: 30px;padding: 4px 10px;}
h4.sets_play span{color: #fff;}
span.wscore{}
span.rscore{left:622px;}

.log_status {float: right; margin: 5px; height: 30px; padding-top: 2px;}
.account {line-height:3.5em;margin: 5px; height: 60px; width:125px;padding-top: 2px;background: url(../images/circled.png) no-repeat top center;margin-top: -10px; }

h2 {float: left; display: inline;text-transform: capitalize;}
td {text-align: left;margin:0;padding:0;line-height:1.8em;}

/*error styling (from scaffold)*/

.fieldWithErrors {
  padding: 2px;
  background-color: red;
  display: inline;
	padding-bottom:6px;
}

#errorExplanation {
  width: 674px;
  border: 2px solid red;
  padding: 7px;
  padding-bottom: 12px;
  margin-bottom: 20px;
  background-color: #E6E1C7;
}

#errorExplanation h2 {
  text-align: center;
  font-weight: bold;
  padding: 5px 5px 5px 15px;
  font-size: 12px;
  margin: -7px;
  background-color: #c00;
  color: #fff;
	width: 668px;
}

#errorExplanation p {
  color: #444;
  margin-bottom: 0;
  padding: 5px;
}

#errorExplanation ul li {
  font-size: 12px;
  list-style: square;
display: block;
}

/*buttons*/
input.update, input.create {border: none;}
input.update {
	background: url(../images/update.png);
}
input.update:hover {
	background: url(../images/update.png) 222px;
}

input.create {
	background: url(../images/create.png);
}
input.create:hover {
	background: url(../images/create.png) 222px;
}

input#fset_submit {float:right;display:inline;margin-top: -25px;}
.fset_submit{float: right; margin-top: -25px;}
.name_update, .new_set {height: 50px; width: 500px; padding: 5px;}

input#game_submit,input#fset_submit.tagit, a.flip {height: 55px; width: 111px; border: none;}
input#game_submit.right{background:url(../images/right.png);}
input#game_submit.right:hover{background:url(../images/right.png) 222px 0;}
input#game_submit.wrong{background:url(../images/wrong.png);}
input#game_submit.wrong:hover{background:url(../images/wrong.png) 222px 0;}
input#game_submit.until{background:url(../images/until_100.png); float:left;}
input#game_submit.until:hover{background:url(../images/until_100.png) 222px 0;}
input#game_submit.only{background:url(../images/wrong_only.png); float:left;}
input#game_submit.only:hover{background:url(../images/wrong_only.png) 222px 0;}
input#fset_submit.tagit {height:25px;position:relative;right:80px;}

a.flip {
	background: url(../images/flip.png);
}
a.flip:visited {
	background: url(../images/flip.png) 333px 0;
}
a.flip:hover {
	background: url(../images/flip.png) 222px 0;
}

.fleft{float:left;}
.fright {float:right;}
table.fright{margin-right: 30px; font-size: 0.8em; margin-top: 10px; border: 1px solid #777;background-color: #E6E1C7;}
table.fleft{font-size: 0.8em; border: 1px solid #777; margin: 20px;background-color: #E6E1C7;}
.stats_control{width: 680px;}
th {background: #E6E1C7; color: #444; font-weight: 800;}

#flip, #gotit{position: absolute;top:225px;}
.play_page{margin-top: 30px;margin-left:90px;}

.create_box {border: 1px solid #777; background-color: #E6E1C7; filter:alpha(opacity=77); opacity:.77; width: 688px;height:175px;}
table.fsets_grid {padding-left: 15px; font-size:0.9em;}

#flash, #error {background-color:#246;
color:#fff;
margin-right:40px;
line-height:1.3em;
margin-left:6px;
}

div#prog {position:absolute;
right:100px;
top:5px;}
#_percentText {color: #777;font-size: 1em;line-height:1.3em;left:125px;}

td a {margin-left: -5px; margin-right:0;}

.stars {padding-top: 5px;}

.tag_cloud {background:#E6E1C7;
color:#444444;
font-weight:800; float: left; border: 1px solid #777;margin:20px;padding:5px; margin-right:50px;
line-height:1.6em;}
/*input#fset_submit.tagit {position:absolute; margin:5px;padding:0;}*/
input#fset_submit.tagit{background:url(../images/tagit.png);}
input#fset_submit.tagit:hover{background:url(../images/tagit.png) 222px 0;}
#profile_pic {float: left; padding: 10px; margin-left: 10px;background-color:#E6E1C7;
border:1px solid #777777;}
.profile_info {margin:0 30px; text-align:left;width:340px; margin-right:5px;}
.box {background-color:#E6E1C7;
border:1px solid #777777;padding: 10px;}
h3 {border-bottom:1px solid #777777; color: #777; text-transform: uppercase;}

/*paginate*/

h4.sets div.pagination a.prev_page, h4.sets div.pagination span.prev_page {position: absolute; left: 15px; top: 4px; font-size:11px;text-transform:uppercase;}
h4.sets div.pagination a.next_page, h4.sets div.pagination span.next_page {position: absolute; right: 30px; top: 4px; font-size:11px;text-transform:uppercase;}
div.pagination {font-size: 11px;}
#pages {margin-right: 235px; text-align:center;}
h4.sets div.pagination .disabled {display:none;}

.css1 { font-size: 0.6em; background:#E6E1C7;}
.css2 { font-size: 1.2em; background:#d6d1C7;}
.css3 { font-size: 2.4em; background:#c6c1C7;}
.css4 { font-size: 4.8em; background:#b6b1C7;}

.pp {width: auto;line-height:1.2em;}

/*div#tags span a {position:absolute; font-weight:800;font-size:0.8em;margin:0;
padding:0;
display:inline;}*/

div#tags span a.tag_delete_link {
background:#777;
color:#FFFFFF;
display:inline;
font-size:0.6em;
font-weight:800;
height:11px;
line-height:1.2em;
margin:5px;
padding:2px;
position:relative;
top:-5px;
width:40px;
text-transform:uppercase;text-indent:0px;}

div#tags span {border: 1px solid #777;float:left; margin: 5px;width:auto;height:auto;text-align:left;text-indent:5px;background:#fff;}

div#tags {width: 640px;}
div#search {width: 700px;}
div#search a {width:auto; height:auto; padding:5px; border: 1px solid #777;color:#444;}
